import React, { useEffect } from 'react'
import { Modal, Form } from 'antd'
import Text from '@components/Text'
import style from './Index.module.less'
import { formatDate } from '@src/assets/js/tool'

const { Item } = Form

function Main ({ data, visible, hide }) {
  const [formRef] = Form.useForm()
  useEffect(() => {
    if (visible && data && formRef) {
      formRef.setFieldsValue(data)
    }
  }, [data, formRef, visible])
  useEffect(() => {
    if (!visible && formRef) {
      formRef.resetFields()
    }
  }, [visible, formRef])
  return (
    <Modal title='仲裁机构详情' width='800px' open={visible} onCancel={hide} footer={false} forceRender>
      <Form form={formRef} className={style.detail} labelCol={{ flex: '200px' }}>
        <Item label='机构名称' name='name'>
          <Text />
        </Item>
        <Item label='机构简称' name='sname'>
          <Text />
        </Item>
        <Item label='机构英文名称' name='enname'>
          <Text />
        </Item>
        <Item label='机构英文简称' name='senname'>
          <Text />
        </Item>
        <Item label='统一社会信用代码' name='idno'>
          <Text />
        </Item>
        <Item label='执行机构（办公室）性质' name='nature'>
          <Text />
        </Item>
        <Item label='法定代表人' name='principal'>
          <Text />
        </Item>
        <Item label='住所' name='address'>
          <Text />
        </Item>
        <Item label='联系电话' name='tel'>
          <Text />
        </Item>
        <Item label='简介' name='introduction'>
          <Text />
        </Item>
        <Item label='成立时间' name='founding_datetime'>
          <Text format={v => typeof v === 'number' && v > 0 ? formatDate(v, 'YYYY-MM-DD') : '无'} />
        </Item>
        <Item label='最近换届时间' name='elect_datetime'>
          <Text format={v => typeof v === 'number' && v > 0 ? formatDate(v, 'YYYY-MM-DD') : '无'} />
        </Item>
        <Item label='专业仲裁院数量' name='professional_court'>
          <Text />
        </Item>
      </Form>
    </Modal>
  )
}

export default Main
